<template>
  <div class="search">
    <Row>
      <Col>
        <Card>
          <Row>
            <Col :span="5">
              <Button @click="getList" icon="md-refresh" style="margin-right:10px">刷新</Button>
              <Button @click="showAddModal" type="primary" icon="md-add">添加</Button>
            </Col>
            <Col :span="19">
              <Form ref="searchForm" inline :model="searchForm" :label-width="85">
                <FormItem label="套餐分类" prop="goodCategoryId" v-if="service != '四大金刚'">
                  <Poptip trigger="click" placement="right-start" title="分类" width="100%">
                      <Input v-model="searchForm.goodCategoryName" style="width:100%" readonly placeholder="请选择商品分类" />
                      <div slot="content" style="position:relative;min-height:5vh">
                        <Tree :data="classifyData" :load-data="loadData" @on-select-change="selectOneTreeEdit" ref="treeOne"></Tree>
                        <Spin size="large" fix v-if="loadingEdit"></Spin>
                      </div>
                  </Poptip> 
                </FormItem>
                <FormItem label="套餐名称">
                  <Input v-model="searchForm.goodName" clearable placeholder="套餐名称" class="itemInput" />
                </FormItem>
                <Form-item style="margin-left:-40px">
                  <Button type="default" @click="clearIpt" style="margin-right:10px">清空</Button>
                  <Button type="primary" @click="search" style="margin-right:10px">搜索</Button>
                </Form-item>
              </Form>
            </Col>
          </Row>

          <Row>
            <Table :loading="loading" border :columns="commodityColumns" :data="commodityData" ref="table" sortable="custom" @on-sort-change="changeSort"></Table>
          </Row>

          <Row type="flex" justify="end" class="page">
            <Page :current="searchForm.pageNumber" :total="pageTotal" :page-size="searchForm.pageSize" @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10,20,50]" size="small" show-total show-elevator show-sizer></Page>
          </Row>
        </Card>
      </Col>
    </Row>
    <!-- 查看大图 -->
    <Modal title="查看大图" v-model="visible" class="imgModal">
      <img :src="imgSrc" style="width: 100%" />
    </Modal>
    <!-- 添加商品 -->
    <Modal :title="modalTitle" v-model="modalVisible" :mask-closable="false" :width="800">
      <Form ref="addForm" :model="addForm" :label-width="100" :rules="formRules">
        <FormItem label="套餐名称" prop="goodName">
          <Input v-model="addForm.goodName" placeholder="请输入套餐名称" />
        </FormItem>
        <FormItem label="套餐分类" prop="goodCategoryId" v-if="service != '四大金刚'">
          <Poptip trigger="click" placement="right-start" title="分类" width="100%">
            <Input v-model="addForm.goodCategoryName" style="width:100%" readonly placeholder="请选择商品分类" />
            <div slot="content" style="position:relative;min-height:5vh">
              <Tree :data="classifyData" :load-data="loadData" @on-select-change="selectTwoTreeEdit" ref="treeTwo"></Tree>
              <Spin size="large" fix v-if="loadingEdit"></Spin>
            </div>
          </Poptip> 
        </FormItem>
        <FormItem label="套餐原价" prop="goodOldPrice">
          <Input v-model="addForm.goodOldPrice" placeholder="请输入套餐原价" />
        </FormItem>
        <FormItem label="套餐现价" prop="goodNewPrice">
          <Input v-model="addForm.goodNewPrice" placeholder="请输入套餐现价" />
        </FormItem>
        <!-- <FormItem label="积分" prop="integral">
          <InputNumber v-model="addForm.integral" placeholder="请输入积分" style="width: 100%"></InputNumber>
        </FormItem> -->
        <FormItem label="套餐轮播图片" prop="goodPics">
          <upload-pic-thumb @on-change="addForm.goodPics=$event" v-model="addForm.goodPics" ref="picsUpload" style="width:100%"></upload-pic-thumb>
        </FormItem>
        <FormItem label="套餐视频展示图" prop="goodVideoPic">
          <upload-pic-input v-model="addForm.goodVideoPic" style="width:100%"></upload-pic-input>
        </FormItem>
        <FormItem label="套餐视频" prop="goodVideo">
          <upload-video v-model="addForm.goodVideo" style="width:100%"></upload-video>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="text" @click="modalVisible = false">取消</Button>
        <Button type="primary" @click="handleSubmit">提交</Button>
      </div>
    </Modal>

    <!-- 添加购买须知 -->
    <Modal :title="modalTitle" v-model="noticeVisible" :mask-closable="false" :width="800">
      <Form ref="form" :model="form" :label-width="100" :rules="formValidate">
        <FormItem label="标题" prop="title">
          <Input v-model="form.title" placeholder="请输入套餐名称" />
        </FormItem>
        <FormItem label="格式" prop="Type">
          <Select v-model="form.Type" style="width:100%" @on-change="selectNotice">
            <Option value="1">列表</Option>
            <Option value="2">文字</Option>
            <Option value="3">图文</Option>
          </Select> 
        </FormItem>
        <FormItem label="套餐内容" prop="content" v-if="noticeType === '2'">
          <Input v-model="form.content" placeholder="请输入套餐内容" type="textarea" />
        </FormItem>
        <FormItem v-for="(item,index) in formDynamic.items" :key="index" :label="'第' + (index + 1) + '项'" v-if="noticeType === '1'">
          <Row>
            <i-col span="9">
              <Input v-model="item.title" placeholder="请输入标题，例如：相册" style="width: 85%" />
            </i-col>
            <i-col span="9">
              <Input v-model="item.count" placeholder="请输入数量，例如：50张" style="width: 85%" />
            </i-col>
            <i-col span="4" offset="1">
              <i-button type="error" @click="handleRemove(item)">删除</i-button>
            </i-col>
          </Row>
        </FormItem>
        <FormItem v-if="noticeType === '1'">
          <Row>
            <i-col span="12">
              <Button type="dashed" long @click="handleAdd" icon="plus-round">新增</Button>
            </i-col>
          </Row>
        </FormItem>
        <FormItem label="套餐内容" v-if="noticeType === '3'">
          <editor id="editor" v-model="form.editorcontent" ref="editor"></editor>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="text" @click="modalVisible = false">取消</Button>
        <Button type="primary" :loading="submitLoading" @click="handleSubmitMeal">提交</Button>
      </div>
    </Modal>

    <Modal title="列表" v-model="noticeDataVisible" :mask-closable="false" :width="800" >
      <Row style="margin-bottom: 20px;">
        <Button type="primary" @click="showSpecification">添加</Button>
      </Row>
      <Row>
        <Table :loading="loading" border :columns="noticeColumns" :data="noticeData" ref="table" sortable="custom" @on-sort-change="changeSort"></Table>
      </Row>
      <Row type="flex" justify="end" class="page">
        <Page :current="noticeForm.pageNumber" :total="total" :page-size="noticeForm.pageSize" @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10,20,50]" size="small" show-total show-elevator show-sizer></Page>
      </Row>
    </Modal>

    <!-- 特殊节日 -->
    <Modal title="特殊节日" v-model="specialVisible" :mask-closable='false' :width="1100">
      <Row>
        <Button type="primary" @click="addSpecialFesitval">添加</Button>
      </Row>
      <Row style="margin-top:30px;">
        <Table :loading="loading" border :columns="specialFestivalColumns" :data="specialFestivalData"  ref="table" sortable="custom" @on-sort-change="changeSort"></Table>
      </Row>
      <Row type="flex" justify="end" class="page">
        <Page :current="festivalForm.pageNumber" :total="specialTotal" :page-size="festivalForm.pageSize" @on-change="changeFestivalPage" @on-page-size-change="changeFestivalPageSize" :page-size-opts="[10]" size="small" show-total show-elevator show-sizer></Page>
      </Row>
    </Modal>

    <!-- 特殊节日 -->
    <Modal :title="festivalTitle" v-model="addSpecialVisible" :mask-closable='false' :width="900">
      <Form ref="specialFestivalForm" :model="specialFestivalForm" :label-width="100" :rules="specialFestivalRules" >
        <FormItem label="特殊节日日期" prop="scheduleTime">
          <Date-picker type="date" placeholder="选择日期" style="width: 100%" @on-change="changeSpecialTime" :value="specialFestivalForm.scheduleTime"></Date-picker>
        </FormItem>
        <FormItem label="特殊节日价格" prop="goodsPrice">
          <Input v-model="specialFestivalForm.goodsPrice" style="width: 100%" placeholder="请输入特殊节日价格" />
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="text" @click="addSpecialVisible=false">取消</Button>
        <Button type="primary" :loading="submitLoading" @click="specialHandleSubmit">提交</Button>
      </div>
    </Modal>

    <!-- 四大金刚无档期 -->
    <Modal title="无档期" v-model="presideVisible" :mask-closable='false' :width="1100">
      <Row>
        <Button type="primary" @click="addPreside">添加</Button>
      </Row>
      <Row style="margin-top:30px;">
        <Table :loading="loading" border :columns="presideColumns" :data="presideData"  ref="table" sortable="custom" @on-sort-change="changeSort"></Table>
      </Row>
    </Modal>

    <!-- 四大金刚无档期 -->
    <Modal :title="presideTitle" v-model="addPresideVisible" :mask-closable='false' :width="900">
      <Form ref="presideForm" :model="presideForm" :label-width="100" :rules="presideRules" >
        <FormItem label="特殊节日日期" prop="noScheduleTime">
          <Date-picker type="date" placeholder="选择日期" style="width: 100%" @on-change="changeRresideTime" :value="presideForm.noScheduleTime"></Date-picker>
        </FormItem>
        <FormItem label="特殊节日时间段" prop="dayTimeType" >
          <Select v-model="presideForm.dayTimeType" style="width: 100%">
            <Option value="A_M">上午</Option>
            <Option value="P_M">下午</Option>
          </Select>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="text" @click="addPresideVisible=false">取消</Button>
        <Button type="primary" :loading="submitLoading" @click="presideHandleSubmit">提交</Button>
      </div>
    </Modal>
  </div>
</template>

<script>
import { validateName } from "@/libs/validate";
import {
  getCategoryList,
  removeCommodity,
  addCommodity,
  editCommodity
} from "@/api/commodity";
import uploadPicInput from "@/views/my-components/xboot/upload-pic-input";
import uploadPicThumb from "@/views/my-components/xboot/upload-pic-thumb";
import uploadVideo from "@/views/my-components/xboot/upload-video"
import editor from "@/views/my-components/xboot/editor";
export default {
  components: {
    uploadPicInput,
    uploadPicThumb,
    uploadVideo,
    editor
  },
  data() {
    return {
      scheduleForm: {
        pageNumber: 1,
        pageSize: 10,
        goodsId: "",
        goodTypeEnum: "GOODSPACKAGE"
      },
      festivalForm: {
        pageNumber: 1,
        pageSize: 10,
        goodsId: "",
        goodTypeEnum: "GOODSPACKAGE"
      },
      specialTotal: 0,
      presideVisible: false,
      addPresideVisible: false,
      presideTitle: "",
      festivalTitle: "",
      addSpecialVisible: false,
      specialVisible: false,
      submitLoading: false,
      noticeVisible: false,
      noticeDataVisible: false,
      noticeData: [],
      noticeForm: {
        pageNumber: 1,
        pageSize: 10,
        goodsPackageId: "",
        introduceAndDuy: "2"
      },
      total: 0,
      noticeColumns: [
        {
          type: "index",
          width: 60,
          align: "center",
          fixed: "left"
        },
        {
          title: "名称",
          key: "title",
          minWidth: 120,
          sortable: false,
        },
        {
          title: "内容类型",
          key: "type",
          minWidth: 40,
          sortable: false,
          render:(h,params)=> {
            if (params.row.type === 1) {
              return h("span", "列表")
            } else if (params.row.type === 2) {
              return h("span", "文字")
            } else if (params.row.type === 3) {
              return h("span", "图文")
            }
          }
        },
        {
          title: "内容",
          key: "content",
          minWidth: 120,
          sortable: false,
          render: (h,params)=> {
            if (params.row.type === 1) {
              var arr = JSON.parse(params.row.content);
              console.log(arr);
              var str = "";
              var arr2 = [];
              arr.forEach((item2,index)=> {
                arr2.push(h("div",[
                  h("span",(index+1)+"、"),
                  h("span",item2.title+"："),
                  h("span",item2.count)
                ]))
              })
              return h("div", arr2)
            } else if (params.row.type === 2) {
              return h("span", params.row.content)
            } else {
              return h('div',{
                domProps:{
                  innerHTML:`${params.row.content}`
                }
              })
            }
          }
        },
        {
          title: "操作",
          width: 160,
          align: "center",
          render: (h, params) => {
            return h("div", [
              h(
                "Button",
                {
                  props: {
                    type: "info",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px"
                  },
                  on: {
                    click: () => {
                      this.editNotice(params.row);
                    }
                  }
                },
                "编辑"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "error",
                    size: "small",
                  },
                  style: {
                    marginRight: "5px",
                  },
                  on: {
                    click: () => {
                      this.removeNotice(params.row);
                    }
                  }
                },
                "删除"
              )
            ]);
          }
        }
      ],
      noticeType: "",
      index: 1,
      formDynamic: {
          items: [
            {
              title:"",
              count: ''
            }
          ]
      },
      form: {
        id: "",
        goodsPackageId: "",
        title: "",
        Type: "",
        introduceAndDuy: "",
        content: "",
        editorcontent: ""
      },
      formValidate: {
        title: [{ required: true, message: "不能为空", trigger: "blur" }],
        Type: [{ required: true, message: "不能为空", trigger: "change" }],
        introduceAndDuy: [{ required: true, message: "不能为空", trigger: "change" }],
        content: [{ required: true, message: "不能为空" }],
        editorcontent: [{ required: true, message: "不能为空" }],
      },
      introduceAndDuy:"",
      loading: true,
      visible: false,
      modal1:false,
      lookPreVisible: false,
      preVisible: false,
      imgSrc: "",
      pageTotal: 0, //总条数
      drop: false, //搜索栏
      modalVisible: false, //模态框的显示隐藏
      modalType: "add", //add: 添加商品     edit编辑商品
      modalTitle: "添加商品",
      commodityData: [],
      category: [],
      color: [],
      size: [],
      //商品显示
      commodityColumns: [
        {
          type: "index",
          width: 60,
          align: "center",
          fixed: "left"
        },
        {
          title: "套餐名称",
          key: "goodName"
        },
        {
          title: "商家名称",
          key: "shopName"
        },  
        {
          title: "套餐图片",
          slot: "action",
          key: "goodPics",
          render: (h,params) => {
            var imgs = params.row.goodPics.split(",");
            return h("img", {
              attrs: {
                src: imgs[0]
              },
              style: {
                width: "40px",
                height: "30px"
              },
              on: {
                click: ()=> {
                  this.handleView(imgs[0])
                }
              }
            })
          }
        },      
        {
          title: "套餐原价",
          key: "goodOldPrice"
        },
        {
          title: "套餐现价",
          key: "goodNewPrice"
        },
        {
          title: "分类名称",
          key: "goodCategoryName"
        },
        {
          title: "创建时间",
          key: "createTime"
        },        
        {
          title: "操作",
          width: 420,
          align: "center",
          fixed: "right",
          render: (h, params) => {
            return h("div", [
              h(
                "Button",
                {
                  props: {
                    type: "info",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px"
                  },
                  on: {
                    click: () => {
                      this.edit(params.row);
                    }
                  }
                },
                "编辑"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "primary",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px",
                    display: (this.service === "四大金刚") ? "inline-block" : "none"
                  },
                  on: {
                    click: () => {
                      this.showSpecialFestival(params.row);
                    }
                  }
                },
                "特殊节日"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "primary",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px",
                    display: (this.service === "四大金刚") ? "inline-block" : "none"
                  },
                  on: {
                    click: () => {
                      this.showSchedule(params.row);
                    }
                  }
                },
                "无档期时间"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "error",
                    size: "small",
                  },
                  style: {
                    marginRight: "5px",
                    display:(params.row.delFlag==1)?"none":"inline-block"
                  },
                  on: {
                    click: () => {
                      this.remove(params.row);
                    }
                  }
                },
                "下架"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "default",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px",
                    display:(params.row.delFlag==0)?"none":"inline-block"
                  },
                  on: {
                    click: () => {
                      this.remove(params.row);
                    }
                  }
                },
                "上架"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "primary",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px",
                  },
                  on: {
                    click: () => {
                      this.showNoticeData(params.row);
                    }
                  }
                },
                "购买须知"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "info",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px",
                  },
                  on: {
                    click: () => {
                      this.showIntroduction(params.row);
                    }
                  }
                },
                "商品介绍"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "info",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px",
                    display: (params.row.recommend === 0) ? "inline-block" : "none"
                  },
                  on: {
                    click: () => {
                      this.recommendCommodities(params.row);
                    }
                  }
                },
                "推荐套餐"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "default",
                    size: "small"
                  },
                  style: {
                    marginRight: "5px",
                    display: (params.row.recommend === 1) ? "inline-block" : "none"
                  },
                  on: {
                    click: () => {
                      this.removeRecommend(params.row);
                    }
                  }
                },
                "取消推荐"
              ),
            ]);
          }
        }
      ],
      searchForm: {
        pageNumber: 1,
        pageSize: 10,
        goodName: "",
        goodCategoryId: "",
        goodCategoryName: ""
      },
      addForm: {
        goodCategoryId: "",
        goodCategoryName: "",
        goodName: "",
        goodPics: "",
        typeEnum: "GOODSPACKAGE",
        // integral: 0,
        goodNewPrice: "",
        goodOldPrice: "",
        goodVideoPic: "",
        goodVideo: ""
      },
      formRules: {
        goodName: [{ required: true, message: "请输入套餐名称", trigger: "blur" },
          { validator: validateName, trigger: "blur" },
          { type: 'string', max: 30, message: '套餐名称不能多于30字', trigger: 'blur' }],
        goodCategoryId: [{ required: true, message: "请选择套餐分类", trigger: "change" }],
        goodPics:  [
          { required: true, message: "请选择套餐轮播", trigger: "blur", type: "array" },
          { type: 'array', max: 5, min: 3, message: '套餐轮播最少3张，最多5张', trigger: 'blur' }],
        goodVideoPic:  [{ required: true, message: "请选择套餐视频预览图", trigger: "change" }],
        // goodVideo:  [{ required: true, message: "请选择套餐视频", trigger: "blur" }],
        goodNewPrice: [{ required: true, message: "请输入套餐原价", trigger: "blur",pattern:/^(([1-9]\d{0,9})|0)(\.\d{0,2})?$/ },
                    { required: true, message: "套餐原价格式不正确",pattern:/^(([1-9]\d{0,9})|0)(\.\d{0,2})?$/}],
        goodOldPrice: [{ required: true, message: "请输入套餐现价", trigger: "blur",pattern:/^(([1-9]\d{0,9})|0)(\.\d{0,2})?$/ },
                    { required: true, message: "套餐现价格式不正确",pattern:/^(([1-9]\d{0,9})|0)(\.\d{0,2})?$/}],
        // integral: [ { required: true, message: "商品积分只能为正整数", trigger: "blur", pattern: /(^[1-9]\d*$)/ }],
      },
      goodId: "",
      goodsPackageId:"",
      modalStatus: 0,
      classifyData: [],
      loadingEdit: false,
      service: "",
      specialFestivalData: [],
      specialFestivalColumns: [
        {
          type: "index",
          width: 60,
          align: "center",
          fixed: "left"
        },
        {
          title: "特殊节日日期",
          minWidth: 120,
          sortable: false,
          key: "scheduleTime"
        },
        {
          title: "特殊节日时间",
          minWidth: 120,
          sortable: false,
          key: "dayTimeType"
        },
        {
          title: "特殊节日价格",
          minWidth: 120,
          sortable: false,
          key: "goodsPrice"
        },
        {
          title: "操作",
          key: "action",
          align: "center",
          width: 280,
          render: (h, params) => {
            return h("div", [
              h(
                "Button",
                {
                  props: {
                    type: "primary",
                    size: "small",
                    icon: "ios-create-outline"
                  },
                  style: {
                    marginRight: "5px",
                  },
                  on: {
                    click: () => {
                      this.editFestival(params.row);
                    }
                  }
                },
                "编辑"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "error",
                    size: "small",
                  },
                  style: {
                    marginRight: "5px"
                  },
                  on: {
                    click: () => {
                      this.removeFestival(params.row);
                    }
                  }
                },
                "删除"
              ),
            ]);
          }
        }
      ],
      specialFestivalForm: {
        id: "",
        // dayTimeType: "",
        scheduleTime: "",
        goodsPrice: "",
        goodsId: "",
        goodTypeEnum: "GOODSPACKAGE"
      },
      specialFestivalRules: {
        // dayTimeType: [{ required: true, message: "请选择时间段", trigger: "change" }],
        scheduleTime: [{ required: true, message: "请选择特殊节日", trigger: "change" }],
        goodsPrice: [{ required: true, message: "请输入规格价格", trigger: "blur", pattern:/^(([1-9]\d{0,9})|0)(\.\d{0,2})?$/ },
                    { required: true, message: "规格价格格式不正确",pattern:/^(([1-9]\d{0,9})|0)(\.\d{0,2})?$/}],
      },
      presideForm: {
        goodsId: "",
        goodTypeEnum: "GOODSPACKAGE",
        dayTimeType: "",
        noScheduleTime: ""
      },
      presideData: [],
      presideRules: {
        dayTimeType: [{ required: true, message: "请选择时间段", trigger: "change" }],
        noScheduleTime: [{ required: true, message: "请选择特殊节日", trigger: "change" }],
      },
      presideColumns: [
        {
          type: "index",
          width: 60,
          align: "center",
          fixed: "left"
        },
        {
          title: "无档期日期",
          minWidth: 120,
          sortable: false,
          key: "noScheduleTime"
        },
        {
          title: "无档期时间",
          minWidth: 120,
          sortable: false,
          key: "dayTimeType"
        },
        {
          title: "创建时间",
          minWidth: 120,
          sortable: false,
          key: "createTime"
        },
        {
          title: "操作",
          key: "action",
          align: "center",
          width: 280,
          render: (h, params) => {
            return h("div", [
              h(
                "Button",
                {
                  props: {
                    type: "primary",
                    size: "small",
                    icon: "ios-create-outline"
                  },
                  style: {
                    marginRight: "5px",
                  },
                  on: {
                    click: () => {
                      this.editPreside(params.row);
                    }
                  }
                },
                "编辑"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "error",
                    size: "small",
                  },
                  style: {
                    marginRight: "5px"
                  },
                  on: {
                    click: () => {
                      this.removePreside(params.row);
                    }
                  }
                },
                "删除"
              ),
            ]);
          }
        }
      ],
    };
  },
  methods: {
    specialHandleSubmit () {
      this.$refs.specialFestivalForm.validate(valid=> {
        if (valid) {
          console.log(valid)
          this.submitLoading = true;
          // if (this.modalType === "add") {
            this.postRequest("/compereAuctionCalendar/insertOrderUpdateCompereAuctionCalendar",  this.specialFestivalForm).then(res=> {
              this.submitLoading = false;
              if (res.success) {
                this.$Message.success("添加成功");
                this.loading = true;
                this.postRequest("/compereAuctionCalendar/PcGetCompereAuctionCalendar", this.festivalForm).then(res=> {
                  this.loading = false;
                  if (res.success) {
                    this.specialFestivalData = res.result.data;
                    this.specialTotal = res.result.size;
                    this.$forceUpdate()
                  } else {
                    this.specialFestivalData = [];
                    this.specialTotal = 0
                  }
                })
                this.addSpecialVisible = false;
              } else {
                this.$Message.error(res.message);
                this.addSpecialVisible = false;
              }
            })
          // } else {

          // }
        }
      })
    },

    presideHandleSubmit () {
      this.$refs.presideForm.validate(valid=> {
        if (valid) {
          this.submitLoading = true;
          this.postRequest("/compereNoCalendars/insertOrderUpdateCompereNoCalendars", this.presideForm).then(res=> {
            this.submitLoading = false;
            if (res.success) {
              this.$Message.success("操作成功");
              this.loading = true;
              this.postRequest("/compereNoCalendars/PcGetCompereNoCalendars", this.scheduleForm).then(res=> {
                this.loading = false;
                if (res.success) {
                  this.presideData = res.result.data;
                } else {
                  this.presideData = []
                }
              })
              this.addPresideVisible = false
            } else {
              this.$Message.error(res.message);
              this.addPresideVisible = false
            }
          })
        }
      })
    },

    addPreside () {
      this.presideTitle = "添加无档期数据";
      this.$refs.presideForm.resetFields();
      this.addPresideVisible = true;
      delete this.presideForm.id;
    },

    editPreside (v) {
      this.presideTitle = "编辑无档期数据";
      this.presideForm.noScheduleTime = v.noScheduleTime;
      (v.dayTimeType == "上午") ? (this.presideForm.dayTimeType = "A_M") : (this.presideForm.dayTimeType = "P_M")
      this.presideForm.id = v.id;
      this.addPresideVisible = true;
    },

    removeFestival (v) {
      this.$Modal.confirm({
        title: "删除",
        content: "确认删除该数据吗？",
        loading: false,
        onOk: ()=> {
          var data = {
            goodsId: this.festivalForm.goodsId,
            scheduleTime: v.scheduleTime
          }
          this.postRequest("/compereAuctionCalendar/removeCompereAuctionCalendar", data).then(res=> {
            this.loading = false;
            if (res.success) {
              this.$Message.success("删除成功");
              this.postRequest("/compereAuctionCalendar/PcGetCompereAuctionCalendar", this.festivalForm).then(res=> {
                if (res.success) {
                  this.specialFestivalData = res.result.data;
                  this.specialTotal = res.result.size;
                  this.$forceUpdate()
                } else {
                  this.specialFestivalData = [];
                  this.specialTotal = 0;
                }
              })
              this.$Modal.remove();
            } else {
              this.$Message.error(res.message);
              this.$Modal.remove();
            }
          })
        }
      })
    },

    removePreside (v) {
      this.$Modal.confirm({
        title: "删除",
        content: "确认删除该数据吗？",
        loading: false,
        onOk: ()=> {
          var data = {
            id: v.id
          }
          this.postRequest("/compereNoCalendars/removeCompereNoCalendars", data).then(res=> {
            this.loading = false;
            if (res.success) {
              this.$Message.success("删除成功");
              this.loading = true;
              this.postRequest("/compereNoCalendars/PcGetCompereNoCalendars", this.scheduleForm).then(res=> {
                this.loading = false;
                if (res.success) {
                  this.presideData = res.result.data;
                } else {
                  this.presideData = []
                }
              })
              this.$Modal.remove();
            } else {
              this.$Message.error(res.message);
              this.$Modal.remove();
            }
          })
        }
      })
    },

    // 展示无档期列表
    showSchedule (v) {
      this.presideForm.goodsId = v.id;
      this.scheduleForm.goodsId = v.id
      this.loading = true;
      this.postRequest("/compereNoCalendars/PcGetCompereNoCalendars", this.scheduleForm).then(res=> {
        this.loading = false;
        if (res.success) {
          this.presideData = res.result.data;
        } else {
          this.presideData = []
        }
      });
      this.presideVisible = true;
    },
    changeSpecialTime (event) {
      this.specialFestivalForm.scheduleTime = event;
    },

    changeRresideTime (event) {
      this.presideForm.noScheduleTime = event;
    },
    changeFestivalPage(num) {
      this.festivalForm.pageNumber = num
      this.postRequest("/compereAuctionCalendar/PcGetCompereAuctionCalendar", this.festivalForm).then(res=> {
        this.loading = false;
        if (res.success) {
          this.specialFestivalData = res.result.data;
          this.specialTotal = res.result.size;
        } else {
          this.specialFestivalData = [];
          this.specialTotal = 0;
        }
      })
    },
    changeFestivalPageSize (num) {
      this.festivalForm.pageSize = num
      this.postRequest("/compereAuctionCalendar/PcGetCompereAuctionCalendar", this.festivalForm).then(res=> {
        this.loading = false;
        if (res.success) {
          this.specialFestivalData = res.result.data;
          this.specialTotal = res.result.size;
        } else {
          this.specialFestivalData = [];
          this.specialTotal = 0;
        }
      })
    },
    // 展示特殊节日列表
    showSpecialFestival (v) {
      this.specialFestivalForm.goodsId = v.id;
      this.festivalForm.goodsId = v.id;
      this.loading = true;
      this.postRequest("/compereAuctionCalendar/PcGetCompereAuctionCalendar", this.festivalForm).then(res=> {
        this.loading = false;
        if (res.success) {
          this.specialFestivalData = res.result.data;
          this.specialTotal = res.result.size;
        } else {
          this.specialFestivalData = [];
          this.specialTotal = 0;
        }
      })
      this.specialVisible = true;
    },

    // 添加特殊节日
    addSpecialFesitval () {
      this.festivalTitle = "添加特殊节日";
      this.$refs.specialFestivalForm.resetFields()
      this.modalType = "add";
      this.addSpecialVisible = true;
      delete this.specialFestivalForm.id;
    },

    // 编辑特殊节日
    editFestival (v) {
      this.festivalTitle = "编辑特殊节日";
      this.modalType = "edit";
      this.specialFestivalForm.scheduleTime = v.scheduleTime;
      this.specialFestivalForm.goodsPrice = v.goodsPrice;
      this.addSpecialVisible = true;
    },
    selectTwoTreeEdit(v){
      console.log(v);
      if (v[0].parentId === "0") {
        this.$Message.warning("添加或修改商品只能选择子节点")
      } else {
        var data = {
          pid:v[0].id
        }
        this.addForm.goodCategoryId = v[0].id;
        this.addForm.goodCategoryName = v[0].title;
        this.$forceUpdate();
      }
    },

    selectOneTreeEdit(v){
      console.log(v);
      var data = {
        pid:v[0].id
      }
      this.searchForm.goodCategoryId = v[0].id;
      this.searchForm.goodCategoryName = v[0].title;
      this.$forceUpdate();
    },

    clearIpt () {
      if (this.service != "四大金刚") {
        this.searchForm.goodCategoryId = "";
        this.searchForm.goodCategoryName = "";
        let data = this.$refs.treeOne.getSelectedNodes()[0];
        if (data) {
          data.selected = false;
        }
      }
      
      this.searchForm.shopName = "";
      this.searchForm.goodName = "";
    },

    // 购买须知类型
    selectNotice (e) {
      console.log(e);
      this.noticeType = e;
    },

    handleAdd () {
      this.formDynamic.items.push({
        title: "",
        count: ""
      });
    },

    handleRemove (item) {
      this.formDynamic.items.$remove(item);
    },

    showNoticeData (v) {
      this.noticeForm.goodsPackageId = v.id;
      this.form.goodsPackageId = v.id;
      this.noticeForm.introduceAndDuy = "2";
      this.loading = true;
      this.postRequest("/goodsIntroduce/goodsIntroduceList",this.noticeForm).then(res=> {
        this.loading = false
        if (res.success) {
          this.noticeData = res.result.data;
          this.total = res.result.size;
        } else {
          this.noticeData = [];
          this.total = 0
        }
      })
      this.noticeDataVisible = true;
    },

    showIntroduction (v) {
      console.log(v)
      this.noticeForm.goodsPackageId = v.id;
      this.form.goodsPackageId = v.id;
      this.noticeForm.introduceAndDuy = "1";
      this.loading = true;
      this.postRequest("/goodsIntroduce/goodsIntroduceList",this.noticeForm).then(res=> {
        this.loading = false
        if (res.success) {
          this.noticeData = res.result.data;
          this.total = res.result.size;
        } else {
          this.noticeData = [];
          this.total = 0
        }
      })
      this.noticeDataVisible = true;
    },

    recommendCommodities (v) {
      this.$Modal.confirm({
        title: "推荐",
        content: "确认推荐该套餐吗？",
        loading: true,
        onOk: ()=> {
          var data = {
            goodId: v.id
          }
          this.postRequest("/recommendedPackage/insertOrderUpdateRecommendedPackage", data).then(res=> {
            this.loading = false;
            if (res.success) {
              this.$Message.success("推荐成功");
              this.getList();
              this.$Modal.remove()
            } else {
              this.$Message.error(res.message);
              this.$Modal.remove()
            }
          })
        }
      })
    },

    removeRecommend (v) {
      this.$Modal.confirm({
        title: "取消推荐",
        content: "确认取消推荐该套餐吗？",
        loading: true,
        onOk: ()=> {
          var data = {
            ids: v.id
          }
          this.postRequest("/recommendedPackage/removeRecommendedPackage", data).then(res=> {
            this.loading = false;
            if (res.success) {
              this.$Message.success("取消推荐成功");
              this.getList();
              this.$Modal.remove()
            } else {
              this.$Message.error(res.message);
              this.$Modal.remove()
            }
          })
        }
      })
    },

    showSpecification (v) {
      this.$refs.form.resetFields();
      delete this.form.id;
      this.form.introduceAndDuy = this.noticeForm.introduceAndDuy;
      this.form.Type = "";
      this.form.content = ""
      this.noticeType = "";
      this.formDynamic = {
          items: [
            {
              title:"",
              count: ''
            }
          ]
      }
      this.noticeVisible = true;
    },

    editNotice (row) {
      this.form.id = row.id;
      this.modalTitle = "编辑"
      this.form.goodsPackageId = row.goodsPackageId;
      this.form.title = row.title;
      this.form.Type = row.type.toString();
      this.noticeType = row.type.toString();
      if (row.type === 1) {
        this.formDynamic.items = JSON.parse(row.content);
        this.form.content = "";
      } else if (row.type === 2){
        this.form.content = row.content
      } else if (row.type === 3) {
        console.log(row)
        this.$refs.editor.setData(row.content);
        this.form.content = ""
        this.formDynamic = {
          items: [
            {
              title:"",
              count: ''
            }
          ]
        }
      }
      this.noticeVisible = true;
    },

    // 删除购买须知
    removeNotice (v) {
      this.$Modal.confirm({
        title: "删除",
        content: "您确认要删除该条购买须知吗?",
        loading: true,
        onOk: () => {
          let param={
            ids:v.id
          }
          this.postRequest("/goodsIntroduce/removeGoodsIntroduce",param).then(res => {
            this.$Modal.remove();
            if (res.success) {
              this.$Message.success("取消成功");
              this.$Modal.remove()
              this.loading = true;
              this.postRequest("/goodsIntroduce/goodsIntroduceList",this.noticeForm).then(res=> {
                this.loading = false
                if (res.success) {
                  this.noticeData = res.result.data;
                  this.total = res.result.size;
                } else {
                  this.noticeData = [];
                  this.total = 0
                }
              })
            }
          });
        } 
      })
    },

    changeSort () {

    },

    // 获取分类列表
    getCategory() {
      this.postRequest("/goodCategory/getBackStoreCategoryList").then(res=> {
        if (res.success) {
          res.result.forEach(function(e) {
            e.title=e.title;
              if (e.havaNext) {
                e.loading = false;
                e.children = [];
              }
            });
          this.classifyData = res.result;
        }
      })
    },
    
    // 获取商品列表
    getList() {
        // 分类id是个数组，这里转为字符串
      let data = {}

      this.postRequest("/good/PCgoodsPackageList", this.searchForm).then(res=> {
        this.loading = false
        if (res.success) {
          this.commodityData = res.result.data;
          this.pageTotal = res.result.size
        } else {
          this.commodityData = [];
          this.pageTotal = 0
        }
      })
    },

    // 搜索商品
    search() {
      this.getList()
    },

    loadData(item, callback) { 
      // 异步加载树子节点数据
      var param ={
        pid:item.id
      }
      this.postRequest("/goodCategory/getGoodCategoryList",param).then(res => {
        if (res.success) {
          res.result.forEach(function(e) {
            e.title=e.title
            if (e.isParent) {
              e.loading = false;
              e.children = [];
            }
          });
          callback(res.result);
        }
      });
    },

    // 编辑商品
    edit(row) {
      console.log(row);
      
      this.modalType = "edit";
      this.modalTitle = "编辑商品";
      // this.addForm.id = row.id;
      // this.addForm.goodCategoryId = row.goodCategoryId;
      // this.addForm.goodCategoryName = row.goodCategoryName;
      // this.addForm.goodOldPrice = row.goodOldPrice;
      // this.addForm.goodNewPrice = row.goodNewPrice;
      // // this.addForm.integral = row.integral;
      
      
      var data = {
        id: row.id
      }
      this.postRequest("/good/PCgoodParticulars", data).then(res=> {
        if (res.success) {
          this.addForm.id = res.result.id;
          this.addForm.goodCategoryId = res.result.goodCategoryId;
          this.addForm.goodCategoryName = res.result.goodCategoryName;
          this.addForm.goodOldPrice = res.result.goodOldPrice;
          this.addForm.goodNewPrice = res.result.goodNewPrice;
          this.addForm.goodName = res.result.goodName;
          if (res.result.goodPics === null) {

          } else {
            this.$refs.picsUpload.uploadList = [];
            var array = res.result.goodPics.split(",")
            this.$refs.picsUpload.setData(array);
          }
          this.addForm.goodVideoPic = res.result.goodVideoPic;
          this.addForm.goodVideo = res.result.goodVideo;
        }
      })
      this.modalVisible = true;
    },

    // 添加套餐
    showAddModal() {
      // 添加商品不需要商品的id
      delete this.addForm.id;
      if (this.service != "四大金刚") {
        let data = this.$refs.treeTwo.getSelectedNodes()[0];
        if (data) {
          data.selected = false;
        }
        this.addForm.goodCategoryId = "";
        this.addForm.goodCategoryName = "";
      } else {
        this.addForm.goodCategoryId = JSON.parse(this.getStore("userInfo")).classId;
      }
      
      this.$refs.addForm.resetFields()
      this.addForm.goodPics = "";
      // this.addForm.integral = "";
      var data1 = "";
      // this.$refs.editor.setData(data1);
      this.$refs.picsUpload.uploadList = [];
      this.modalVisible = true;
      this.modalType = "add";
      this.modalTitle = "添加商品";
    },
    // 商品上架，下架
    remove(v) {
        removeCommodity({
            id: v.id
          }).then(res => {
            if(res.success) {
              this.$Message.success('操作成功')
              this.getList();
            }else{
              this.$Message.error('操作失败');
            }
          })
    },
    // 切换页
    changePage(num) {
        this.searchForm.pageNumber = num
        this.getList()
    },
    // 切换每页显示条数
    changePageSize (num) {
        this.searchForm.pageSize = num;
        this.getList()
    },
    // 放大图片
    handleView(src) {
      this.visible = true;
      this.imgSrc = src;
    },

    // 提交表单，添加、编辑都调用这个
    handleSubmit() {
      // 判断是添加还是编辑
      if (Number(this.addForm.goodNewPrice) > Number(this.addForm.goodOldPrice)) {
        this.$Message.warning("商品现价不能高于商品原价")
      } else {
        this.$refs.addForm.validate(valid => {
          if (valid) {
            this.submitLoading = true;
            if (this.modalType === "add") {
              delete this.addForm.id;
              //  添加
              var array1 = [];
              this.$refs.picsUpload.uploadList.forEach(item1=> {
                array1.push(item1.url)
              })
              this.addForm.goodPics = array1.join(",");
              addCommodity(this.addForm).then(res => {
                this.submitLoading = false;
                if (res.success) {
                  this.$Message.success("操作成功");
                  this.getList();
                } else {
                  this.$Message.error(res.message);
                }
                this.modalVisible = false;
              });
            } else {
              //  编辑
              var array1 = [];
              this.$refs.picsUpload.uploadList.forEach(item1=> {
                array1.push(item1.url)
              })
              this.addForm.goodPics = array1.join(",")
              editCommodity(this.addForm).then(res => {
                this.submitLoading = false;
                if (res.success) {
                  this.$Message.success("操作成功");
                  this.getList();
                } else {
                  this.$Message.error(res.message);
                }
                this.modalVisible = false;
              });
            }
          }
        })
      }
    },

    handleSubmitMeal () {
      console.log(this.formDynamic);
      this.$refs.form.validate(valid=> {
        if (valid) {
          this.submitLoading = true;
          if (this.noticeType === '1') { // list
            this.form.content = JSON.stringify(this.formDynamic.items)
            this.postRequest("/goodsIntroduce/insertOrderUpdateGoodsIntroduce", this.form).then(res=> {
              if (res.success) {
                this.submitLoading = false;
                this.noticeVisible = false;
                this.$Message.success("操作成功");
                this.loading = true;
                this.postRequest("/goodsIntroduce/goodsIntroduceList",this.noticeForm).then(res=> {
                  this.loading = false
                  if (res.success) {
                    this.noticeData = res.result.data;
                    this.total = res.result.size;
                  } else {
                    this.noticeData = [];
                    this.total = 0
                  }
                })
              }
            })
          } else if (this.noticeType === '2') {
            this.postRequest("/goodsIntroduce/insertOrderUpdateGoodsIntroduce", this.form).then(res=> {
              if (res.success) {
                this.submitLoading = false;
                this.noticeVisible = false;
                this.$Message.success("操作成功");
                this.loading = true;
                this.postRequest("/goodsIntroduce/goodsIntroduceList",this.noticeForm).then(res=> {
                  this.loading = false
                  if (res.success) {
                    this.noticeData = res.result.data;
                    this.total = res.result.size;
                  } else {
                    this.noticeData = [];
                    this.total = 0
                  }
                })
              }
            })
          } else if (this.noticeType === '3') {
            this.form.content = this.form.editorcontent;
            this.postRequest("/goodsIntroduce/insertOrderUpdateGoodsIntroduce", this.form).then(res=> {
              if (res.success) {
                this.submitLoading = false;
                this.noticeVisible = false;
                this.$Message.success("操作成功");
                this.loading = true;
                this.postRequest("/goodsIntroduce/goodsIntroduceList",this.noticeForm).then(res=> {
                  this.loading = false
                  if (res.success) {
                    this.noticeData = res.result.data;
                    this.total = res.result.size;
                  } else {
                    this.noticeData = [];
                    this.total = 0
                  }
                })
              }
            })
          }
        }
      })
    },
    init () {
      console.log(JSON.parse(this.getStore("userInfo")))
      this.service = JSON.parse(this.getStore("userInfo")).serviceCategoryName;
      if (this.service === "四大金刚") {
        this.addForm.goodCategoryId = JSON.parse(this.getStore("userInfo")).classId;
      } else {
        this.getCategory();
      }
      this.getList();
    }
  },
  created() {
    this.init()
  }
};
</script>

<style>
.commodity-content {
  padding: 16px;
  background-color: #ffffff;
}
.itemInput {
  width: 160px;
}
.selected {
  width: 50%;
}
.imgModal {
  text-align: center;
}
.img {
  width: 50px;
  height: 50px;
}
.page{
        margin: 16px;
        overflow: hidden;
        text-align: right;
    }
.paygos{
  margin-top: 40px;
}
.paygo1{
  margin-top: -50px;
}
</style>